<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="/common/main.jsp" %>
<input type="hidden" id="current" value="${VIDEO_PAGE.curr_total }">
<input type="hidden" id="total" value="${VIDEO_PAGE.total }">
<input type="hidden" id="number" value="${VIDEO_PAGE.number }">
<c:forEach var="video"  items="${VIDEO_LIST}">
<div class="col-xs-6 col-sm-4 col-md-3">
    <div class="item">
        <div class="pos-rlt">
            <div class="item-overlay opacity r r-2x bg-black">
                <div class="center text-center m-t-n">
                    <a href="javascript:;" onclick="loadVideo('${video.id}')"><i class="fa fa-play-circle i-2x"></i></a>
                </div>
            </div>
            <a href="javascript:;"><img src="${V_PATH}${video.imgUri}" style="max-height: 125px;max-width: 245px" alt="" class="r r-2x img-full"></a>
        </div>
        <div class="padder-v">
            <a href="javascript:;" class="text-ellipsis">${video.name }</a>
            <a href="javascript:;" class="text-ellipsis text-xs text-muted">by ${video.author }</a>
            <a href="${V_PATH }/download.action?fileName=${video.name}.mp4&musicURL=${video.videoUri}"  class="m-r-sm"><i class="icon-cloud-download"></i></a>
        </div>
    </div>
</div>
</c:forEach>